<template>
  <div>
    <div class="container">
      <!-- #masthead -->
      <div class="boxs">
        <el-row :gutter="20">
          <BArticle v-for="item in list" :key="item.id" :item="item" @getAll="getAll"></BArticle>
        </el-row>
      </div>
      
    </div>
  </div>
</template>

<script>
import axios from "@/axios";
import api from '@/axios';
import BArticle from "@/components/BArticle";
import bus from "@/bus/index"
import _ from 'lodash'
export default {
  name: "BIndex",
  components: { BArticle },
  data() {
    return {
      list: [],
    };
  },
  mounted() {
    this.getAll();
    bus.$on("setData",async (url)=>{
        let result = await api(url)
        this.list = result.data
    })
  },
  methods: {
    async getAll() {
      let list = await axios("/picture/all");
      let {data} = await axios("/ptype/all")
      this.list = list.data.map(item=>{
        for(let ts of data){
          if(item.ptype == ts.id){
            item.type = ts.tname
          }
        }
        return item
      });
    },
  },
  beforeDestroy(){
    bus.$off("setData")
  }
};
</script>

<style lang="less" scoped>
.boxs{
  margin-top: 3.125rem;
}

</style>